{extend name="public/base"/} {block name="body"}
<div class="main-box no-header clearfix">
    <header class="main-box-header clearfix">
        <div class="pull-left">
            <h2>{$meta_title}</h2>
        </div>
        <div class="pull-right">
            <!-- <a href="{:url('add')}" class="btn btn-primary pull-right"> <i class="fa fa-plus-circle fa-lg"></i> 新增</a> -->
        </div>
    </header>
    <div class="main-box-body clearfix">
        <div class="row">
            <form class="form-horizontal" action="{:url('addArea')}" method="post">
                <div class="col-md-2">
                    <p>
                        一级区域
                    </p>
                    <select class="form-control" name="first_area">
              {volist name=":config('delivery_area')" id="vo"}
                <option value="{$key}">{$vo}</option>
              {/volist}
          </select>
                </div>
                <div class="col-md-2">
                    <p>
                        二级区域
                    </p>
                    <input type="text" name="second_area" class="form-control">
                </div>
                <div class="col-md-2">
                    <p>
                        运费
                    </p>
                    <input type="text" name="freight" class="form-control">
                </div>
                <div class="col-md-2">
                    <p>

                    </p><br />
                    <button type="submit" class="btn btn-danger submit-btn ajax-post" target-form="form-horizontal">添加</button>
                </div>
            </form>
        </div>

        <hr />

        <div class="panel panel-default">
            <div class="panel-body">
                {volist name=":config('delivery_area')" id="vo"}
                <div class="row" style="    margin-bottom: 20px;">
                    <div class="col-md-12">
                        {$vo}： {volist name=":getAreaByFirstarea($key)" id="voo"}
                        <span class="icon-btn">{$voo.second_area} | {$voo.freight} 元<i class="fa fa-times-circle confirm ajax-get" aria-hidden="true" url="{:url('delArea',array('id'=>$voo['id']))} "></i></span> {/volist}
                    </div>
                    <br />
                </div>
                {/volist}
            </div>
        </div>


        <style>
            .icon-btn {
                margin-left: 20px;
                margin-bottom: 10px;
                border: 1px solid #ddd;
                padding: 10px 20px;
                background-color: #fafafa !important;
                background-image: none !important;
                filter: none !important;
                -webkit-box-shadow: none !important;
                -moz-box-shadow: none !important;
                box-shadow: none !important;
                display: inline-block;
                color: #646464 !important;
                text-shadow: none !important;
                text-align: center;
                cursor: pointer;
                position: relative;
                -webkit-transition: all 0.3s ease !important;
                -moz-transition: all 0.3s ease !important;
                -ms-transition: all 0.3s ease !important;
                -o-transition: all 0.3s ease !important;
                transition: all 0.3s ease !important;
            }

            .icon-btn .fa {
                position: absolute;
                font-size: 20px !important;
                top: -5px;
                right: -5px;
                color: red;
            }
        </style>

    </div>
</div>
{/block}
